<!DOCTYPE html>
<html>
<head>
  <style type="text/css" media="screen">
    #test {
      animation-name: test;
      animation-direction: reverse;
      /*
      A non-reversed iteration runs in the range [0, <duration>), so to sample
      on the last keyframe we have to sample at the start of a reversed
      iteration.
      */
      animation-duration: 10s;
    }
    @keyframes test {
        from {
          opacity: 0;
        }
        to {
          opacity: 1;
        }
    }
  </style>
  <script src="resources/animation-test-helpers.js" type="text/javascript" charset="utf-8"></script>
  <script type="text/javascript" charset="utf-8">

    const expectedValues = [
      // [time, element-id, property, expected-value, tolerance]
      [0, "test", "opacity", 1.0, 0],
    ];

    runAnimationTest(expectedValues);
  </script>
</head>
<body>
<p>Tests sampling a keyframe animation on the last keyframe.</p>
<div id="test"></div>
<div id="result">
</div>
</body>
</html>
